<template>
    <Header ></Header>
    <div class="pageheader" :style="`background-image:url(${$config.public.baseUrl}images/bg/home1/8.png)`">
        <div class="container">
            <div class="pageheader__content">
                <h2>404 Page</h2>
                <nav aria-label="breadcrumb">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item"><nuxt-link to="/">Home</nuxt-link></li>
                        <li class="breadcrumb-item active" aria-current="page">404 Page</li>
                    </ol>
                </nav>
            </div>
        </div>
    </div>
    <section class="error padding-top padding-bottom">
        <div class="container" data-aos="zoom-in" data-aos-duration="800">
            <div class="section-header text-center ">
                <h2>OOPS!</h2>
                <p class="style2">Page not found</p>
            </div>
        </div>
        <div class="error__inner" data-aos="fade-up" data-aos-duration="800">
            <div class="error__content text-center">
                <img class=" mb-4" src="/images/others/404.png" alt="404 image">
                <div class="text-center mt-5">
                    <nuxt-link to="/" class="trk-btn trk-btn--rounded trk-btn--secondary1">Go To Home</nuxt-link>
                </div>
            </div>
        </div>

    </section>
    <Footer></Footer>
</template>

<script>
export default {
    scrollToTop: true,
}
</script>